@import '../../var.scss';
@import '../../common.scss';
.list {
  background-color: #fff;
  .item {
    display: flex;
    width: 100%;
    padding: 32rpx 30rpx;
    border-bottom: 1rpx solid $border-color;
  }
  .item1 {
    display: flex;
    align-items: center;
    .content {
      flex: 1;
      .title {
        width: 100%;
        padding-right: 20rpx;
        color: #333333;
        font-weight: 600;
        font-size: 32rpx;
      }
      .footer {
        display: flex;
        width: 100%;
        margin-top: 20rpx;
        color: $info-color;
        font-size: 20rpx;
        .name {
          max-width: 120rpx;
          margin-right: 20rpx;
        }
        .comment {
          margin-right: 20rpx;
        }
      }
    }
    .img {
      width: 227rpx;
      height: 170rpx;
      overflow: hidden;
      image {
        width: 100%;
        height: 100%;
      }
    }
  }
  .item2 {
    flex-wrap: wrap;
    .title {
      width: 100%;
      color: #333333;
      font-weight: 600;
      font-size: 32rpx;
    }
    .images {
      width: 100%;
      margin: 25rpx 0;
      .video-wrap {
        position: relative;
        height: 500rpx;

        .image {
          position: relative;
          width: 100%;
          height: 100%;
          overflow: hidden;
          background: $bgcolor-gray 100% 100% / cover no-repeat;

          &::after {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            display: block;
            background: linear-gradient(transparent 50%, rgba(#000, 0.4) 100%);
            content: '';
          }
        }

        .play-icon {
          position: absolute;
          bottom: 15rpx;
          left: 15rpx;
          width: 120rpx;
          height: 120rpx;
        }
      }
    }
    .imgBox {
      display: flex;
      justify-content: space-between;
      width: 100%;
      margin: 25rpx 0;
      .img {
        width: 227rpx;
        height: 170rpx;
        overflow: hidden;
        image {
          width: 100%;
          height: 100%;
        }
      }
    }
    .footer {
      display: flex;
      width: 100%;
      margin-top: 10rpx;
      color: $info-color;
      font-size: 20rpx;
      .name {
        max-width: 120rpx;
        margin-right: 20rpx;
      }
      .comment {
        margin-right: 20rpx;
      }
    }
  }
}
